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1. INTRODUCTION 

Designs with emotional elements aims to produce products that evoke users’ positive emotion [1, 2]. 
Research suggested that emotion affects users’ perception, decision making [3, 4] and simultaneously entices 
users to engage with the website [5, 6]. Websites with emotionally engaging elements has the potential to 
facilitate website revisit intention and loyalty [7]. Users can be emotionally engaged with a website that has 
affective user interface that stimulates their experience and satisfies their emotional needs. In contrast, 
websites that are poorly designed tend to arouse negative emotions such as anxiety, confusion, and 
frustration. Users become susceptible to negative emotions when they encounter difficulties in navigating the 
website due to poorly designed interface [7]. Therefore, it is crucial to embed emotional elements that can 
encourage joy, pleasure, and interest. To elicit positive emotional response from the users, web designers 
need to identify users’ affective needs. Studies have reported that users’ emotional needs can be linked and 
translated into design elements that are able to trigger emotional engagement [8, 9]. However, the major 
challenge lies in understanding users’ emotional needs and transforming these needs into design features that 
create an ‘emotional bridge’ between the product and the user [10]. Moreover, past study [11] have reported 
that web interface designers are facing a challenge in establishing a standard for web interface designs 
embedded with emotion-evoking cues [11]. 

Due to the influential nature of the emotion-evoking web designs, a recent study [1] employed 
Kansei engineering technique on user interface design for higher learning institution website in Malaysia. 
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The study was inspired by previous research on Kansei engineering technique on web design for e-learning 
[12], e-commerce [13], job hunting sites [11], student blogs [6], university departments website [3] and 
university websites [9]. The study [1] attempted to elicit users’ emotions by incorporating emotion-inducing 
elements in a higher learning institution website. A standard for Kansei-based web design for Higher 
Learning institution was also proposed in study [1]. 

In an attempt to extend previous literature [1], the current study seeks to justify the Kansei-based 
web design standards through the development of a Kansei-based prototype that enables the evaluation of 
users’ emotional experience using a self-reported assessment tool, the Geneva Emotion Wheel (GEW). The 
evaluation of users’ emotion on the Kansei-based web prototype 1s critical in validating the usefulness of the 
web design standards that has been proposed in study [1]. 


2. LITERATURE REVIEW 
2.1. Emotion in Web Design 

The use of emotion in human-computer interaction is highly important as it affects human cognition 
and perception [14]. The involvement of emotions in computer systems design, termed as “affective 
computing”, enhances the computers’ ability to ‘make decisions’ [15], thus associating emotional intelligence 
in machines. This includes the machine’s ability to perceive and respond to emotion, convey emotion, as well 
as handle the emotion of others [14]. Designing a functional website that is appealing and emotion evoking is 
typically done visually. The design of the websites establishes first impression and influences users’ trust and 
decision-making. Users tend to reject and mistrust websites with insufficient emotional elements. Websites 
should be functional, have pleasing aesthetics, and provide emotional engagement to optimize users’ 
experience, and ultimately leading to user satisfaction. Researchers have suggested that affect and emotion in 
information dissemination is more important than functional outcomes such as usefulness and ease 
of use [16]. 

Research focusing on the utilitarian and hedonic dimension of evaluation suggested that users are 
not only concerned about functionality and usability, but also during the human-computer interactions [17] 
[18]. Better human-computer interaction can be achieved through incorporating emotional components in 
web design. Emotion can strongly affect user experience as it triggers user’s attention and subconscious 
evaluation about a product website, environment or interface [17]. User satisfaction could also be enhanced 
through designs that minimize negative emotions such as anger, frustration, annoyance, as well as confusion. 
Systematic website with professional look and feels allows for ease of navigation thus increasing website 
functionality [19]. These induce sense of security, credibility, perceived ease of use, and trust. Conversely, a 
poorly designed website will stimulate feelings of disgust, increasing the likelihood of users hitting the back 
button or closing the browser just to avoid unpleasant interaction with the website [18]. This causes user 
dissatisfaction that will lead to avoidance behavior. Scholars [3] have emphasized the importance of 
incorporating emotional aspects in web design. Designing based on users’ requirements has been a common 
practice in web design, with much consideration being placed on increasing website’s functionality. 
This leaves limited attention on users’ emotional requirements; a significant element of an ideal website 
design [3]. 

A product should satisfy various needs, namely functionality, usability, and pleasure [18]. A product 
should be able to function well, and its usability is achieved if users find the product easy to use. A product 
can bring pleasure to the consumer when it brings joy and happiness to them [3]. Similarly, an easy-to- 
navigate website can be said to bring pleasure to the users with attention-grabbing designs that evoke positive 
emotions [20]. Websites that are able to arouse emotion such as excitement has been proven to be more 
successful than those who do not. Products (including websites) that are laden with emotional cues persuades 
consumers to buy, own, and use them [3]. Therefore, it is essential for all three levels (functionality, 
usability, pleasure) to be embedded in website designs. Emotional elements also have the ability to influence 
users’ preference in selecting websites. These designs offer better user experience that will encourage repeat 
usage [2]. Moreover, aesthetically-pleasing objects tend to capture users’ attention even when they are 
lacking in functionality. Users are more likely to choose a website that is emotionally appealing over a 
similar website that provides equal usability and functionality. 


2.2. Geneva Emotion Wheel 

The Geneva Emotion Wheel (Figure 1) pioneered by Scherer [21] has served as a tool for self- 
reported emotional assessment. Past study [22] indicated that the central constitution of emotion is 
intrinsically subjective and can only be appraised by self-response tools such as the GEW. The two major 
approaches; discrete and dimensional were merged to form the self-report measure to assess emotions. GEW 
incorporates discrete emotions that are aligned in a circular structure in two dimensional spans [21]. The two 
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dimensions; valence and control meticulously align discrete emotions in circles according to their emotion 
families. The valence dimension comprises of negative and positive emotions while the control dimension 
denotes low and high power. The two dimensions (valence and control) diverges in a circularly arranged 
emotions that is separated into four quadrants: positive/low power, positive/high power, negative/low power 
and negative/high power [22]. The control dimension can also be designated as a power dimension 
(control/power) [22]. The emotion terms in GEW are labelled with ordinary layman languages to ease the 
understanding of the emotions by the respondents. GEW incorporates response options for each emotion 
category with different shape of circles indicating different intensity levels. The high intensities were 
symbolized with bigger circles and are aligned towards the edge of the wheel. While, the low intensity 
response options were represented with smaller size circles and are arranged towards the center of the wheel. 
The GEW provides the respondents with two alternative response options which are “no emotion” and “other 
emotions” as a free response style. The measurement tool is designed with user friendly graphical user 
interface (GUI) in order to assist the respondent to easily utilize the instrument for self-response evaluation. 
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Figure 1. GEW version 3.0 


GEW comprises of free response style, discrete emotion reporting, and a multi-dimensional concept 
of emotions [22]. The “other emotion” option in GEW indicates the free response style allowing respondents 
to convey other emotions freely during assessment. Studies indicate that pure free response method can be 
troublesome in emotion measurement process with the presence of diverse responses from the respondents as 
they freely convey their emotions in their own terms, thus reducing the certainty of the emotion evaluation, 
making it difficult to be analyzed [22]. Such problems of the free-response style are enhanced by GEW, as 
the “other emotion” option allows one response along with the existing emotion terms in the wheel. The 
discrete emotions that are aligned in a systematic circular form refer the discrete response approach in GEW. 
GEW allows the respondents to express the emotions they feel corresponding to the emotions in the wheel in 
accordance with the different level of intensities (high to low). The use of ordinary layman language for the 
emotion terms eases the respondents to understand the emotions in GEW. Moreover, the responses are easier 
to be interpreted and analyzed [22]. The arrangement of emotions in accordance with the dimensions is 
visible in GEW compared to the other discrete emotion measurement instruments such as the Differential 
Emotion Scale [23] and Product Emotion Measuring Instrument (PrEmo) [24]. 

The presence of the valence and control dimensions signifies the dimensional approach in GEW. 
The dimensional approach may seem easier for respondents as it requires them to respond to the available 
dimensions instead of answering in various discrete terms. Furthermore, discrete terms may be challenging 
for respondents as the dimensional approach is considerably abstract. Although the results are easy to be 
interpreted and analyzed, the dimensional approach provides lowest delicate results compared to other 
approaches. The blend of discrete and dimensional approaches in GEW is simply strategic as discrete 
emotions are presented in layman language and intensifies measurement particularity, whereas, the presence 
of the dimensional approach assists to detect the emotions in the tool which in turn magnifies usability [22]. 

GEW has been used in various fields to study users’ emotion. [25] employed GEW to study the 
users’ emotions towards the Internet videos. The respondents were asked to convey the emotions they felt 
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before and after watching the Internet videos by labelling the videos and selecting three out of the 36 
emotional descriptors from GEW [21] in accordance with different intensity levels. [25] stated that the use of 
GEW was easier for the participants to express their emotional states and their preferences in videos. [26] 
studied emotions of body movement with the application of GEW. A comparative study was done and the 
emotional interpretation from an animated character and real actor was explored. The research utilized GEW 
with twenty emotion labels. The participants were required to report their emotions towards the two clips 
shown, one with the real actor and another with the animated character. The study reported that the emotions 
towards the clip of the animated character were perceived as less natural. 

Additionally, [27] and [28] have utilized GEW to study emotions in virtual environments. On the 
other hand, [29] employed GEW to study the affective meaning of listener vocalizations. [30] have studied 
emotions in interaction with superiors in workplace and [31] explored the emotions of individual in team 
level and during decision making [31] assured that the GEW can be used under time pressured emotional 
measurement and for repetitive evaluations. [32] compared the utility of the GEW with the PrEmo [24]. The 
study attempted to discover the strength and the weakness of the both emotion measurement instrument and 
to determine the suitability of the instruments in their research field. The study selected two products, 
designers coffee machine for positive emotions and an alarm clock for negative emotions and conducted 
research with selected participants. The research explored whether the participants could express their 
emotions in accordance with the two instruments and also investigated the participants’ memory while 
expressing the emotions. The study revealed that the participants were able to express their emotions with 
GEW better than the PrEmo as the GEW comprises of more range of emotions and the emotions are 
presented with the different intensity levels in systematic circular structure. [32] found out that PrEmo has 
weaknesses such as lack of presentation of the animation in a clear form, the three point scale in PrEmo was 
considered insufficient for the participants to express their emotions and PrEmo comprises of limited number 
of emotions which restricts the participants from conveying their feelings thoroughly. The study discovered 
that the participants favour GEW rather than PrEmo and indicated GEW as an easy tool to use, understand 
and distinguish between emotions and claimed that the GUI of GEW is attractive [22]. 


3. RESEARCH METHOD 

A standard Kansei-based web design guideline for Malaysian higher learning institutions that was 
developed in [1] was used in a design prototype of a higher learning institution website. Universiti Malaysia 
Sabah (UMS) website was chosen as a case study and the website was embedded with findings from [1]. The 
designed Kansei-based website (https://punithathiru92.wixsite.com/mysite) was tested to justify the identified 
standard Kansei-based web design guideline in [1]. Users’ emotional experience towards the Kansei-based 
UMS website was evaluated through this research with the intention to validate the guideline proposed in [1] 
to be utilized in design practices. The developed Kansei-based prototype was evaluated through an online 
GEW survey. 


3.1. Online Survey Design 

An online GEW survey was developed to evaluate users’ emotional experience. The online survey 
was designed in two sections; Section A: Emotion Evaluation with GEW and Section B: Demographic. 
Section A was designed to gauge the users’ emotional experience towards the Kansei-based UMS website. 
Section B was designed to obtain demographic information of the respondents. The link of the UMS website 
prototype was included in the online survey to allow respondents to explore the website prior answering the 
online survey. The online GEW survey used a five-point scale ranging from 1 “low intensity” to 5 “high 
intensity” .The emotion terms were arranged in accordance to the order in GEW. As for the “other emotions” 
option as in GEW a short answer text field was added for the respondents to express the emotions they 
experienced which was not in the list of GEW. The “no emotion” option was included with the five point 
scale which can be chosen by the respondents if they did not feel a particular emotion in the GEW. The 
illustration of the online GEW survey is presented in online (https://goo.gl/forms/BW YSUHSQuQ58gFxE3). 


3.2. Participants and Procedure 

This study targeted users of higher learning institution websites as the subjects for the evaluation. A 
total of 143 respondents participated in the survey. The survey was distributed online through email and 
social media and was available to be answered for the duration of three months. Face to face sessions were 
also carried out simultaneously in UMS. The participants were requested to view the developed Kansei-based 
UMS website for a few minutes by clicking the link provided in the survey and then they were requested to 
answer the survey questions. They also were provided with a list of definitions used in GEW to assist them in 
understanding the emotion terms. 
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4. RESULTS AND DISCUSSION 

The survey gathered the data of users’ emotional experience in accordance with the GEW. The 
users’ emotional experiences measured on 20 emotions from GEW were evaluated, analyzed with descriptive 
statistics and are discussed briefly in the sections below. Since the GEW was measured on a five-point scale 
indicating different intensity level of the emotions (5 = High Intensity and | = Low Intensity), the mean was 
calculated to find the average of the gathered users’ emotional experience data as reported in Figure 2. Figure 
2 showed users’ emotional experiences after exploring the Kansei-based UMS website. Since, the GEW 
includes a center segment with the option ‘no emotion’, the option was implemented with a scale ‘no emotion 
felt’ as ‘0’. So, they have selected the option of ‘no emotion felt’ when they did not experience the particular 
emotion in the list. Figure 3 illustrates the participants’ emotional experience towards the Kansei-based UMS 
website. The data were analyzed with descriptive statistics in order to validate the identified standard 
guideline in [1] and to justify whether it is acceptable in web designing practices. The mean was used as in 
the study [6] to calculate the average data and were analyzed based on the average. 
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Figure 2. Users’ emotional experience relation with Figure 3. Participants’ emotional experience in 


GEW relation with GEW 


The Figure 4 shows the average of each emotion with their different level of intensities. The range 
for each intensity level was calculated and shown in the Table 1. The data was analyzed in relation with the 
range of each intensity levels. Since, this study used five point scale including an extra scale with the score 
‘0’ for no emotion felt option, the range size for each level of intensity was calculated using the formulae [(n- 
1) / n]. Therefore, the range size was [(6-1)/6] which result 5/6 with 0.83333. The range was identified by 
adding the range size to the each intensity score. 

The data were analyzed in accordance to the mean and the range of each intensity level in order to 
find the emotions elicited by the Kansei-based UMS website. The emotions experienced by the users while 
using the website were analyzed and are discussed with the information in Figure 5. Respondents’ active 
participation in the emotional experience evaluation suggests that the Kansei-based UMS website elicits 
positive emotions from the users. The responses showed that the higher learning institution website prototype 
evokes positive emotion formation. The report illustrates that the website induced seven out of the ten 
positive emotions with high intensity. Whereas, the ten negative emotions were evoked at the lowest 
intensity. Three positive emotions that were stated as neutral in Figure 5 indicates that the emotions were 
somewhat felt but not with highest intensities. The data showed that the respondents did not feel any negative 
emotions with high intensity, which means that the majority of the respondents experienced the negative 
emotions with a very low intensity. 
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Table 1. Range of each intensity level 








Intensity Level Range of Intensity 
5 4.16 — 5.00 
4 3.33 —4.15 
3 2.50 — 3.32 
2 1.67 — 2.49 
1 0.84 — 1.66 
0 0.00 — 0.83 


The analyzed data showed the most positive emotions (highlighted in Figure 5) with high intensities 
and all negative emotions with the low intensities, it can be inferred that the Kansei-based UMS website 
elicits positive emotions in users. The result of the users’ emotional experience justified the standard Kansei- 
based web design guideline for higher learning institution websites in [1] and proved that the identified 
standard guideline evokes positive emotions in users. From the result of the Figure 6, users’ emotion model 
with the seven positive emotions which were experienced with high intensity by the majority of the 
participants were identified as a result of the users’ emotional experience. Table 2 illustrates users’ emotion 
model that was identified through the users’ emotional experience evaluation of the Kansei-based UMS 
website that was designed in accordance with the identified standard Kansei-based guideline with detail 
design features as in [1]. All seven emotions in the users’ emotion model are positive valence, indicating the 
Kansei-based UMS website cultivates positive emotional engagement with the users. 


Table 2. Users’ Emotion Model 








Emotion Control/Power Valence 
Interest High Positive 
Pride High Positive 
Joy High Positive 
Pleasure High Positive 
Contentment Low Positive 
Love Low Positive 
Admiration Low Positive 





The users’ emotion model certifies the standard Kansei-based web design guideline in [1] can be 
successfully used in designing practices of higher learning institution websites. This was proved with the 
users’ emotion model consisting of seven positive emotions with four of high control/power and three of low 
control/power which indicates positive users’ emotional experience towards the Kansei-based UMS website. 
Users’ positive emotional engagement with a website is very important as previous researchers have argued 
that a website should able to encourage emotional engagement and elicit positive impressions in order to 
arouse revisit to the website [7]. Users’ emotion model from Table 3 is demonstrated in Figure 6. 
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Figure 6. Users’ Emotion Model 


Seeing the result of positive emotions that elicited towards the Kansei-based UMS website which 
was developed considering the standard Kansei-based web design guideline for higher learning institutions in 
Malaysia as in study [1], this research has justified the standard Kansei-based web design guideline can be 
used in the development of Malaysian higher learning institution websites since it was proved to satisfy the 
users emotionally with the positive emotional engagement as shown in users’ emotion model which 
presented in Figure 7. 


5. CONCLUSION 

The users’ emotional experience evaluation using a self-response method was carried out to justify 
the identified standard Kansei-based web design guideline for Malaysian higher learning institutions from 
[1]. The identified guideline with detail design features as in [1] was implemented into current UMS website 
as a prototype. The prototype was tested to verify that the identified guideline with design details can be used 
in design practices of higher learning institution websites. The users’ emotional experience evaluation has 
proved that the prototype does cultivate positive emotional engagement between users with the identification 
of users’ emotion model which is presented in Figure 7. The users’ emotion model with seven positive 
emotions which were four of high control/power and three of low control/power certified that the standard 
Kansei-based web design guideline evokes positive emotional experience in users. Therefore, the identified 
standard Kansei-based guideline from the study [1] can be used to design an emotional website for higher 
learning institutions in Malaysia. 
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